<!--/**
* Author: ganqz
* Date: 2022-07-28 17:50
* Desc: FooterBtn
*/
-->
<template>
  <view class="footer-btn tc">
    <!-- #ifdef MP-WEIXIN ||  MP-ALIPAY || H5 -->
    <view class="goods-content flex-b-m" v-if="hasCommision">
      <view class="label_btn label_buy fb warning-bg" v-if="memberLevel">
        {{ '自购返' + showCommission(info.commission) + '元' }}</view
      >
      <view class="label_btn label_buy fb" v-else> 购买 </view>
      <!-- #ifdef MP-WEIXIN || H5 -->
      <view
        class="label_btn label_share fb"
        v-if="memberLevel"
        @click.native.stop="onShare"
        >{{ '分享好友购买赚' + showCommission(info.commission) + '元' }}</view
      >
      <view class="label_btn label_share fb" v-else>分享好友购买赚佣金</view>
      <!-- #endif-->
    </view>
    <view class="goods-content_down flex flex-end" v-else>
      <view class="buy-btn fc-white bc-primary fb"> 购买 </view>
    </view>
    <!-- #endif-->

    <share-popup v-model="showShare" v-if="showShare" @click="goFriend" />
    <invite-pop
      v-if="showInvite"
      v-model="showInvite"
      :obj="shareParams"
    ></invite-pop>
  </view>
</template>
<script>
  import { toFixed } from '@/utils/index'
  import { mapGetters } from 'vuex'
  import { navigateTo } from '@/utils/tools'
  import SharePopup from '@/components/SharePopup/index.vue'
  import InvitePop from '@/pages/friends/components/InvitePop.vue'
  import { getIslogin } from '@/utils/auth'
  export default {
    components: {
      InvitePop,
      SharePopup
    },
    props: {
      info: {
        type: Object,
        default() {
          return {}
        }
      },
      customClass: {
        type: String,
        default: ''
      }
    },
    computed: {
      ...mapGetters(['memberLevel']),
      hasCommision() {
        return this.info.openDistribution === '1'
      }
    },
    data() {
      return {
        showShare: false,
        showInvite: false,
        shareParams: {}
      }
    },
    methods: {
      showCommission(commission) {
        return toFixed(commission)
      },
      openInite() {
        this.showInvite = true
      },
      openShare() {
        this.shareParams = {
          type: this.info.mallType === '1' ? 'coupon' : 'normal', //1电影券,2商品
          id: this.info.mallCommodityId,
          name: this.info.name
        }
        this.showShare = true
      },
      goFriend() {
        navigateTo('/pages/friends/index', {
          type: this.info.mallType === '1' ? 'coupon' : 'normal', //1电影券,2商品
          id: this.info.mallCommodityId
        })
      },
      onShare() {
        if (getIslogin()) {
          if (!+this.memberLevel) {
            this.$emit('pop')
          } else {
            this.$emit('share')
          }
        } else {
          this.$tools.navigateTo('/pages/login/index', 'navigateTo')
        }
      }
    }
  }
</script>
<style lang="scss" scoped>
  .goods-content {
    // #ifdef MP-AlIPAY
    justify-content: flex-end;
    // #endif
  }
  .footer-btn {
    .label_btn {
      text-align: center;
      height: 54rpx;
      line-height: 54rpx;
      font-size: 26rpx;
      border-radius: 12rpx;
      padding: 0 13rpx;
    }
    .buy-btn {
      width: 110rpx;
      height: 54rpx;
      color: #fff;
      line-height: 54rpx;
      border-radius: 12rpx;
      text-align: center;
    }
    .label_buy {
      color: #fff;
      width: 160rpx;
      box-sizing: border-box;
      background: linear-gradient(-90deg, #f85d08 0%, #fd550f 99%);
    }
    .label_share {
      color: #fd5f45;
      box-sizing: border-box;
      flex: 1;
      margin-left: 20rpx;
      background: #ffffff;
      border: 1rpx solid #fa5a0b;
    }
  }
</style>
